<template>
    <div>
<!--        <v-container>-->
<!--            <v-row >-->
<!--                <v-img src="https://cd.zzdkdb.com/images/banner.png" ></v-img>-->
<!--            </v-row>-->
<!--        </v-container>-->

<!--        <v-container>-->
<!--            <v-row >-->
<!--                <v-img src="https://cd.zzdkdb.com/images/fotter1.jpg" ></v-img>-->
<!--            </v-row>-->
<!--        </v-container>-->

<!--        <v-container>-->
<!--            <v-row >-->
<!--                <v-img src="https://cd.zzdkdb.com/images/fotter2.png" ></v-img>-->
<!--            </v-row>-->
<!--        </v-container>-->

<!--        <v-container>-->
<!--            <v-row >-->
<!--                <v-img src="https://cd.zzdkdb.com/images/fotter3.jpg" ></v-img>-->
<!--            </v-row>-->
<!--        </v-container>-->

<!--        <v-container>-->
<!--            <v-row >-->
<!--                <v-col cols="12" sm="6" md="4" style="padding: 12px 12px 0 12px;font-size: 0.75rem;background: #FEF4DA">-->
<!--                   <p>&nbsp;&nbsp;东莞中赞贷款代理有限公司是一家做贷款代办服务的中介公司，我们不提供任何贷款产品的担保，我们不参与产品的放贷，我们只做纯助贷贷款咨询服务，公司有新媒体运营部门，商务部门，法务部门，推广部门，招商部门，欢迎全国助贷机构老板或者客户经理咨询合作。</p>-->
<!--                </v-col>-->
<!--            </v-row>-->
<!--        </v-container>-->



        <v-container>
            <v-row >
                <form action="process_form.php" method="post">
                    <!-- 姓名输入框 -->
                    <label for="name">姓名:</label>
                    <input type="text" id="name" name="name" required><br><br>

                    <!-- 手机号输入框 -->
                    <label for="phone">手机号:</label>
                    <input type="tel" id="phone" name="phone" pattern="[0-9]{11}" placeholder="请输入11位手机号" required><br><br>

                    <!-- 验证码输入框 -->
                    <label for="verification_code">验证码:</label>
                    <input type="text" id="verification_code" name="verification_code" required><br><br>

                    <!-- 性别单选框 -->
                    <label>性别:</label>
                    <input type="radio" id="male" name="gender" value="男" checked>
                    <label for="male">男</label>
                    <input type="radio" id="female" name="gender" value="女">
                    <label for="female">女</label><br><br>

                    <!-- 家庭情况多选框 -->
                    <label>家庭情况:</label>
                    <input type="checkbox" id="single" name="family_status[]" value="单身家庭">
                    <label for="single">单身家庭</label>
                    <input type="checkbox" id="nuclear" name="family_status[]" value="核心家庭">
                    <label for="nuclear">核心家庭</label>
                    <input type="checkbox" id="extended" name="family_status[]" value="大家庭">
                    <label for="extended">大家庭</label><br><br>

                    <!-- 提交按钮 -->
                    <input type="submit" value="提交">
                </form>
            </v-row>
        </v-container>

    </div>
</template>


<script>
import axios from "axios";
import { mapGetters } from "vuex";



export default {
    data: () => ({
        dialog: false,
        banner: [],
        home_web_diy:[],
        qr_code: "",
        app_name: '',
    }),
    computed: {
        ...mapGetters(["uid"]),
    },
    created() {
    },
    methods: {

    },
};
</script>

<style lang="scss">

.text-truncate {
    white-space: nowrap; /* 保持文本在一行显示 */
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    max-width: 100%; /* 限制最大宽度，确保不会超出容器 */
}
.truncate-text {
    width: 150px; /* 设置div的宽度，确保能够容纳10个字符 */
    white-space: nowrap; /* 防止换行 */
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 在文本末尾添加省略号 */
}
.square-avatar {
    border-radius: 0 !important; /* 移除圆角 */
}
.border-left-red {
    border-left: 3px solid #ba2b39;
}

</style>


